import React, { useState, useCallback } from "react";

export default function CallbackHookDemo01() {
  const [count, setCount] = useState(0);
  const increment1 = () => {
    //函数每一次都重新定义
    console.log("执行函数");
    setCount(count + 1);
  };

  //   这种方式没有任何性能优化
  const increment2 = useCallback(() => {
    console.log("执行函数");
    setCount(count + 1);
  }, [count]);
  return (
    <div>
      <h2>CallbackHookDemo01</h2>
      <h2>计数: {count}</h2>
      <button onClick={increment1}>+1</button>
      <button onClick={increment2}>+1</button>
    </div>
  );
}
